// sidebar
$menuText:#ffffff;
$menuActiveText:#64d9d6;
$subMenuActiveText:#64d9d6; //https://github.com/ElemeFE/element/issues/12951

$menuBg:transparent;
$menuHover:#263445;

$subMenuBg:#000000;
$subMenuHover:#001528;

$sideBarWidth: 210px;

// the :export directive is the magic sauce for webpack
// https://www.bluematador.com/blog/how-to-share-variables-between-js-and-sass
:export {
  menuText: $menuText;
  menuActiveText: $menuActiveText;
  subMenuActiveText: $subMenuActiveText;
  menuBg: $menuBg;
  menuHover: $menuHover;
  subMenuBg: $subMenuBg;
  subMenuHover: $subMenuHover;
  sideBarWidth: $sideBarWidth;
}
// // 侧边栏
// $menuText: #bfcbd9; // 菜单文本颜色
// $menuActiveText: #409EFF; // 激活状态下的菜单文本颜色
// $subMenuActiveText: #f4f4f5; // 子菜单激活状态下的文本颜色 （参考链接：https://github.com/ElemeFE/element/issues/12951）

// $menuBg: #304156; // 菜单背景颜色
// $menuHover: #263445; // 鼠标悬停在菜单上时的背景颜色

// $subMenuBg: #1f2d3d; // 子菜单背景颜色
// $subMenuHover: #001528; // 鼠标悬停在子菜单上时的背景颜色

// $sideBarWidth: 210px; // 侧边栏的宽度

// // :export 指令是 webpack 的神奇之处
// // （参考文章：https://www.bluematador.com/blog/how-to-share-variables-between-js-and-sass，讲解如何在 JavaScript 和 Sass 之间共享变量）
// :export {
//   menuText: $menuText;
//   menuActiveText: $menuActiveText;
//   subMenuActiveText: $subMenuActiveText;
//   menuBg: $menuBg;
//   menuHover: $menuHover;
//   subMenuBg: $subMenuBg;
//   subMenuHover: $subMenuHover;
//   sideBarWidth: $sideBarWidth;
// }